<template>
  <a-modal v-model:visible="visible" width="700px" class="addLocation" :mask-closable="false" :keyboard="false">
    <template #title>{{ titleObj[opType] }} </template>
    <div v-if="visible" class="modal-main-content p-8">
      <a-form ref="refForm" :model="formData" :label-col="{ style: { width: '90px' } }">
        <a-form-item label="配置名称" name="configName" :rules="[{ required: true, message: '请输入配置名称' }]">
          <a-input v-model:value="formData.configName" placeholder="配置名称" :maxlength="100"></a-input>
        </a-form-item>

        <a-form-item label="业务类型" name="businessType" :rules="[{ required: true, message: '请选择业务类型' }]">
          <a-select v-model:value="formData.businessType" placeholder="请选择业务类型">
            <a-select-option v-for="item in businessTypeList" :key="item.value" :value="item.value">
              {{ item.label }}
            </a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item
          v-if="!isHideProjectType"
          label="试验类型"
          name="projectType"
          :rules="[{ required: true, message: '请选择试验类型' }]"
        >
          <DictFormItem
            v-model:value="formData.projectType"
            app-code="CONFIG"
            flag="PROJECT_TYPE"
            placeholder="试验类型"
            :is-http="true"
          />
        </a-form-item>
      </a-form>
    </div>
    <template #footer>
      <a-button plain @click="closeDialog">取消</a-button>
      <a-button plain type="primary" @click="submitHandle">确定</a-button>
    </template>
  </a-modal>
</template>
<script setup lang="ts">
import { ref, computed } from 'vue'
import { businessTypeList } from './../index'
import {
  addBusinessConfig,
  editBusinessConfig,
  getBusinessConfigInfo,
  copyBusinessConfig
} from '@@/api/pharmacy/businessConfig'
import { message } from 'ant-design-vue'
const emits = defineEmits(['success'])
const visible = ref<boolean>(false)
const initForm = {
  configName: '',
  businessType: null,
  projectType: null
}
function resetData() {
  formData.value = { ...initForm }
  configId.value = ''
}
const configId = ref<string>()
const opType = ref()
const titleObj = {
  1: '新增配置',
  2: '编辑配置',
  3: '复制配置'
}
const show = (type, row?: any) => {
  opType.value = type
  resetData()
  visible.value = true
  configId.value = row?.drugBusinessConfigId || ''
  if (configId.value) {
    getInfo()
  }
}
const getInfo = () => {
  getBusinessConfigInfo({
    id: configId.value
  }).then((res) => {
    Object.assign(formData.value, res)
  })
}

const formData = ref<any>({ ...initForm })

const refForm = ref()
const submitHandle = async () => {
  refForm.value.validate().then((res) => {
    if (res) {
      const params: any = {}
      Object.assign(params, formData.value)
      let fn
      if (opType.value === 1) {
        fn = addBusinessConfig
      } else if (opType.value === 2) {
        fn = editBusinessConfig
      } else if (opType.value === 3) {
        fn = copyBusinessConfig
      }
      fn(params).then(() => {
        message.success('操作成功')
        visible.value = false
        emits('success')
      })
    }
  })
}

function closeDialog() {
  visible.value = false
}
defineExpose({
  show
})
const isHideProjectType = computed(() => {
  const chooseBusiness = businessTypeList.find((i) => i.value === formData.value.businessType)
  if (chooseBusiness) {
    return chooseBusiness.hideProjectType
  }
  return false
})
</script>
<style lang="less">
.addLocation {
  .m-b-0 {
    margin-bottom: 0;
  }
}
</style>
